<template>
  <view>
    <navigator url="/pages/index/addMemorabilia" class="btn">添加大事件</navigator>
    <memorabiliaList :memorabilias="memorabilias"></memorabiliaList>
  </view>
</template>

<script>
import memorabiliaList from '@/components/memorabiliaList.vue'
import {getRequest} from '@/http/index.js'
export default {
  data() {
    return {
      memorabilias: [] //大事件列表
    }
  },
  onLoad() {
    this.getMemorabilias();
  },
  onShow(){
    this.getMemorabilias();
  },
  components: {
    'memorabiliaList': memorabiliaList
  },
  methods: {
    getMemorabilias() {
      getRequest('api/memorabilia/all').then(res => {
        if (res.success) {
          var ChangeTheTime = res.data.memorabilias;
          // 遍历数组中的每个对象
          ChangeTheTime.forEach(function(item) {
            // 将ISO时间转换为Date对象
            var happenDate = new Date(item.happenTime);
            // 将Date对象格式化为所需的正常时间格式
            var formattedHappenTime = happenDate.toLocaleString("zh-CN", {
              year: "numeric",
              month: "2-digit",
              day: "2-digit",
              hour: "2-digit",
              minute: "2-digit",
              second: "2-digit",
            });
            // 将格式化后的时间替换原始字段
            item.happenTime = formattedHappenTime.replace(/\//g, "-").replace(/上午|下午/g,"");
          });
          // 替换转换后的数组
          this.memorabilias = ChangeTheTime;
        }
      }).catch(err => {
        console.log(err)
      })
    }
  }
}
</script>

<style>
.btn{
  width: 70%;
  color: white;
  border-radius: 30px;
  margin: 10px auto;
  background-color: #1296DB;
  text-align: center;
  line-height: 50px;
}
</style>